import React from 'react'
import { connect } from 'dva'
import { Form ,Modal,message} from 'antd'
import { hashHistory } from 'dva/router'
import { mapStateToProps } from 'utils/view_utils'
import styles from './projectListStyle.less'
import ListPage from 'widget/PageTmpl/ListPageQiance'
import classnames from 'classnames/bind';
import FlagBtn from 'widget/FlagBtn/FlagView'
import config from 'config/config'
const confirm = Modal.confirm;
let cx=classnames.bind(styles);


const projectListView = function({dispatch, model, form}) {
  // 表单的子函数
  // const {resetFields, getFieldDecorator, validateFields, setFieldsValue} = form
  // 取出model对象，命名空间
  const { modelObj, namespace } = model
  // modelObj.xxx获取model中状态机的值
  let {biz,areaList,products} = modelObj

  let pageProps = {
    // ---------- 界面部分 ----------
    ui: {
      // 页面接口地址
      api_url: `${config.aheadPlan}admin/attributeGroup/attributeGroup/list`,
      // 接口方式
      method: "GET",
      // "data_field_name":"data",
      app: "",
      // 接口参数
      params: {
        pageSize:10,
        pageNo:1,
        tableType: 3
        },
        
      // 模拟数据 - 用于开发需要，若填充了上面的api_url之后，请将此项设置为null
      // "mockData": mockData,
      mockData: null,
      // 查询栏
      search_bar: {
        fields: [
          {
            en_name: 'areaId',
            zh_name: '区域',
            elem_type: 'SelectFilter',
            elem_valid_type: 'string',
            showSearch: true,
            cmpt_items: areaList,
          },
          {
            en_name: 'projectId',
            zh_name: '项目',
            elem_type: 'SelectFilter',
            elem_valid_type: 'string',
            showSearch: true,
            cmpt_items: products,
            onFocus:()=>{
              if(biz.queryForm && biz.queryForm.areaId){ 
                let areaId= biz.queryForm.areaId
                dispatch({
                  type: `${namespace}/filterProjectList`,
                  payload: {areaId}
                })
              }
            },
          },
          {
            en_name: 'tableName',
            zh_name: '表单名称',
            elem_type: 'SelectFilter',
            elem_valid_type: 'string',
            showSearch: true,
            cmpt_items: [
              {
                value: '土拍市场',
                label: '土拍市场'
              }, 
              {
                value: '政策盘点',
                label: '政策盘点'
              }, 
              {
                value: '竞品管理',
                label: '竞品管理'
              }, 
            ],
          },
          {
            en_name: 'tableTab',
            zh_name: '所属页签',
            elem_type: 'SelectFilter',
            elem_valid_type: 'string',
            showSearch: true,
            cmpt_items: [
              {
                value: '基本信息',
                label: '基本信息'
              }, 
              {
                value: '产品信息',
                label: '产品信息'
              },
              {
                value: '土地信息',
                label: '土地信息'
              },
              {
                value: '限购政策',
                label: '限购政策'
              },
              {
                value: '限售政策',
                label: '限售政策'
              },
              {
                value: '限价政策',
                label: '限价政策'
              },
              {
                value: '限签政策',
                label: '限签政策'
              },
              {
                value: '限贷政策',
                label: '限贷政策'
              },
              {
                value: '其他政策',
                label: '其他政策'
              },
              {
                value: '异动政策',
                label: '异动政策'
              },
            ],
          },
          {
            en_name: 'isShow',
            zh_name: '必填设置',
            elem_type: 'SelectFilter',
            elem_valid_type: 'string',
            showSearch: true,
            cmpt_items: [
              {
                value: '0',
                label: '非必填'
              }, 
              {
                value: '1',
                label: '必填'
              }
            ],
          },
          {
            en_name: 'isEnable',
            zh_name: '状态',
            elem_type: 'SelectFilter',
            elem_valid_type: 'string',
            showSearch: true,
            cmpt_items: [
              {
                value: '0',
                label: '禁用'
              }, 
              {
                value: '1',
                label: '启用'
              }
            ],
          },
          {
            en_name: 'attributeName',
            zh_name: '字段名称',
            elem_type: 'Input',
            elem_valid_type: 'string',
          },
        ],
        searchHandler: () => { // 自定义搜索按钮回调函数，点击搜索时触发
          console.log('search click')
        },
        resetHandler: () => { // 自定义重置按钮回调函数，点击重置时触发
          console.log('reset click')
        },
        searchCallback: params => { // 自定义搜索完成后的后调函数, 搜索完成后触发, 并将本次搜索的参数传入
          console.log('search finish', params)
        },
        pasteTargetList: [  // 列表组件中将输入框的en_name作为默认id(也可以通过id另外设置)
          'channel',  // 将需要粘贴事件拦截的输入框id以数组的形式传入, 该参数对应PasteFromClipboard组件的targetList参数
        ]
      },
      // 数据表格  序号 是否生效 项目名称  佣金方案名称 方案生效日期 方案失效日期 审批人 审批通过日期   提交人 提交日期  创建人 创建日期
      table:
        {
          rowSelectionInfo: {
            type: 'checkbox',
          },
          status_params: "status=0",
          status_text: "全部",
          // 表头字段列表
          scroll: { x: 1400},
          fields: [
            {
              en_name: "ruleNo",
              zh_name: "序号",
              width: 60,
              render: (a, item, index, d, e, f) => {
                return index+1
              },
            },
            {
                en_name: "areaName",
                zh_name: "区域",
            },
            {
                en_name: "projectName",
                zh_name: "项目",
            },
            {
                en_name: "tableName",
                zh_name: "表单名称",
            },
            {
                en_name: "tableTab",
                zh_name: "所属页签",
            },
            {
                en_name: "attributeName",
                zh_name: "字段名称",
            },
            {
              en_name: "isShow",
              zh_name: "必填设置",
              render:(a, item, index, d, e, f)=>{
                if(item.isShow == 0){
                  return '非必填'
                }else if(item.isShow == 1){
                  return '必填'
                }
              }
            },
            {
              en_name: "isRadio",
              zh_name: "控件类型",
              render:(a, item, index, d, e, f)=>{
                if(item.isRadio == 1){
                  return '单选'
                }else if(item.isRadio == 2){
                  return '多选'
                }else if(item.isRadio == 3){
                  return '文本框'
                }else if(item.isRadio == 4){
                  return 'segment框'
                }else if(item.isRadio == 5){
                  return '日期控件'
                }else if(item.isRadio == 6){
                  return '富文本框'
                }else if(item.isRadio == 7){
                  return '媒体类型'
                }else if(item.isRadio == 8){
                  return '固定值'
                }else if(item.isRadio == 9){
                  return '多选+输入框'
                }else if(item.isRadio == 10){
                  return '地址'
                }else if(item.isRadio == 11){
                  return '城市'
                }
              }
            },
            {
              en_name: "isEnable",
              zh_name: "状态",
              render:(a, item, index, d, e, f)=>{
                if(item.isEnable == 0){
                  return '禁用'
                }else if(item.isEnable == 1){
                  return '启用'
                }
              }
            },
            {
              en_name: "sort",
              zh_name: "排序",
            },
            {
              en_name: "edit",
              zh_name: "操作",
              width:130,
              fixed:'right',
              render: (a, item, index, d, e, f) => {
                return (
                    <span>
                        <FlagBtn node={<a onClick={() => switchFun('switch',item)}>{item.isEnable ==1?"禁用":'启用'}<span className="ant-divider" /></a>} btnId={''}> </FlagBtn>
                        <FlagBtn node={<a onClick={() => addOrEditSkip('check',item)}>查看<span className="ant-divider" /></a>} btnId={''}> </FlagBtn>
                        <FlagBtn node={<a onClick={() => addOrEditSkip('edit',item)}>编辑<span className="ant-divider" /></a>} btnId={''}> </FlagBtn>
                    </span>
                )
              },
            }
          ]
        },
      // 操作栏
      action_bar: [
        {
          label: "新增",
          type: "primary",
          rowSelection:[],
          onClick: (e,row) =>{
            hashHistory.push({
              pathname: '/home/predictManage/projectListDetail',
              query: {}
            })
          }
        }
      ]
    },
  }

  // 查看及编辑跳转
  function addOrEditSkip(type,item){
      hashHistory.push({
        pathname: '/home/predictManage/projectListDetail',
        query: {actionType: type, id:item.id }
      })
  }
  //禁用启用
  function switchFun(type,item){
    let val = ''
    item.isEnable==1?val= 0:val= 1
    dispatch({
      type: `${namespace}/switchFun`,
      payload: { id: item.id,isEnable:val}
    })
  }

  if (!!modelObj.biz) {
		pageProps.biz = modelObj.biz
		pageProps.biz.syncBackCbf = (biz) => {
			dispatch({
				type: `${namespace}/updateStore`,
				payload: { biz }
			})
		}
  }

  return (
    <div className={cx('pageLayout')}>
      <ListPage pageProps={pageProps}/>
    </div>
  )
}
// 连接视图(view)和模型(model)
export default connect(mapStateToProps)(Form.create()(projectListView))
